<template>
	<div class="list_two_type13">
		<!-- 遍历组件的项目items -->
		<div class="item" v-for="item in data.items" :key="item.action.path">
			<!-- 图片 -->
			<img v-lazy="item.img_url">
			<div class="text">
				<!-- 标题；简介；价格；立即购买按钮 -->
				<p>{{item.product_name}}</p>
				<p style="color:#999;font-size: 9px;">{{item.product_brief}}</p>
				<p style="color:#f70">￥{{item.market_price}}起</p>				<span
				:style="{color:data.btn_txt_color,backgroundColor:data.btn_color}"
				class="btn">立即购买</span>	
			</div>
		</div>
	</div>
</template>
<script>
	export default{
		props:{
			// 父组件传入data数据
			data:{
				type:Object
			}
		}
	}
</script>
<style scoped="scoped" lang="scss">
	.list_two_type13{
		display: flex;
		width: 100%;
		.item{
			flex:1;
			text-align: center;
			font-size: 12px;
		}
		img{
			width: 100%;
			object-fit: cover;
		}
		p{
			margin-top: .05rem;
		}
		.btn{
			border-radius: 4px;
			background-color: #ccc;
			display: inline-block;
			padding: .1rem .4rem;
			margin: .1rem;
		}
		.text{
			padding: .15rem;
		}
	}
</style>
